<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    div {
      height: 30px;
      background-color: pink;
      border: 1px solid red;
      padding-left: 30px;  /*因为这个盒子没有宽度，所以padding 不会影响盒子的宽度*/
      /*padding-top: 10px;*/
    }
   nav {
     margin: 0;
     width: 500px;
     height: 30px;
     background-color: palevioletred;
     border: 1px solid green;
   }
    p {
      /*因为p没有指定宽度，则会默认和父亲一样宽 块级元素*/
      margin: 0;
      padding-left: 50px;
    }
  </style>
</head>

<body>
 <div>奔跑吧，兄嘚</div>
 <nav>
   <p>摔跤吧，小兄弟</p>
 </nav>
</body>
</html>
